@import "theme/theme_1";
.detail {
    .banner img {
        display: block;
        width: 100%;
        height: 440pm;
    }
    .desc {
            position: relative;
            font-size: 24pm;
            color: @color3;
            line-height: 40pm;
            &:nth-of-type(1) {
                margin-top: 12pm;
            }
        }
    .info_wrap {
        padding: 0 23pm;
        .title {
            padding: 22pm 0 0;
            font-size: 32pm;
            color: @color6;
            line-height: 40pm;
        }
        .tag {
            width: 34pm;
            height: 34pm;
            line-height: 34pm;
            font-size: 24pm;
        }
        .desc {
            position: relative;
            font-size: 20pm;
            color: @color3;
            line-height: 40pm;
            margin-top: 12pm;
            &.handel {
                width: 100%;
                padding: 0;
            }
        }
        i{
            font-family: "iconfont";
            &.location{
                font-size: 26pm;
            }
            &.timer{
                font-size: 21pm;
                padding-right: 4pm;
                padding-left: 4pm;
            }
            &.like{
                position: relative;
                top:1pm;
                margin-right: 8pm;
            }
        }
        .addFav {
            position: absolute;
            right: 0;
            top: 40pm;
            font-size: 26pm;
            color: #979797;
            &.active i{
                color:#F3d646;
            }
        }
        .line {
            padding: 14pm 9pm 0;
            &::after {
                display: block;
                content: "";
                width: 100%;
                height: 0;
                border: 2pm dashed #f3efef;
            }
        }
        .handel {
            padding: 28pm 0 34pm;
            .handel_info {
                width: 400pm;
                font-size: 24pm;
                color: @color3;
                line-height: 42pm;
            }
            .btn {
                margin-top: 12pm;
            }
            .btn-yuyue i{
                position: relative;
                top: 3pm;
                margin-right: 22pm;
                display: inline-block;
                width: 25pm;
                height: 24pm;
                background: url(../images/icon_7.png) no-repeat;
                background-size: 25pm 24pm;
            }
        }
    }
    .other_wrap {
        &.pd{
            padding-bottom: 24pm;
        }
        margin-top: 24pm;
        padding: 0 20pm;
        .border-1px(top,@border);  
        .other_title {
            height: 76pm;
            line-height: 76pm;
            font-size: 28pm;
            color: @color5;
            .border-1px(bottom,@border); 
        }
    }
    .lesson_detail {
        .teacher {
            margin-top: 10pm;
            line-height: 44pm;
            font-size: 26pm;
            color: @color9;
            font-weight: bold;
        }
        p {
            line-height: 42pm;
            font-size: 24pm;
            color: @color3;
            letter-spacing: 0px;
        }
        img {
            display: block;
            width: 100%;
            max-width: 100%;
            margin-bottom: 20pm;
        }
    }
    .lessons {
        .lesson_item {
            padding: 22pm 0 20pm 14pm;
            .border-1px(bottom,@border);
            .imgWrap {
                position: relative;
                float: left;
                width: 250pm;
                height: 200pm;
                img {
                    display: block;
                    width: 100%;
                    height: 100%; 
                }
            }
            .lesson_info {
                float: left;
                margin-left: 20pm;
                width: 314pm;
                .title {
                    font-size: 28pm;
                    color: @color6;
                    line-height: 42pm;
                    a{
                        color: @color6;
                    }
                }
                .desc {
                    font-size: 24pm;
                    color: @color3;
                    line-height: 26pm;
                    margin-top: 8pm;
                }
                .icon_1,
                .icon_2 {
                    margin-right: 6pm;
                }
                .icon_1 {
                    display: inline-block;
                    width: 14pm;
                    height: 19pm;
                    background: url(../images/icon_1.png) no-repeat;
                    background-size: 14pm 19pm;
                }
                .icon_2 {
                    display: inline-block;
                    width: 17pm;
                    height: 17pm;
                    background: url(../images/icon_2.png) no-repeat;
                    background-size: 17pm 17pm; 
                }
            }
        }
    }
}
